<template>
  <div class="mb20 postManageModal">
    <div class="pub-table-action-btn" v-if="!disabled">
      <a-button icon="plus" class="btn_right" type="primary" @click="handleAddEditPost('', 1)" style="margin-bottom:10px">新增岗位</a-button>
    </div>
    <list-table ref="table" :columns="columns"  :request="loadData" row-key="id" bordered show-size-changer show-quick-jumper :page-keys="['pageNo', 'pageSize','totalSize']">
      <template slot="operation" slot-scope="text, record">
        <div class="pub-table-list-action" v-if="!disabled">
          <MoreButton>
            <span @click="() => handleAddEditPost(record, 2)">编辑</span>
            <a @click="() => handleAddEditJob(record)">关联下属岗位</a>
            <a @click="() => handleDeleteWarning(record)">删除</a>
          </MoreButton> 
        </div>
        <div class="pub-table-list-action" v-else>
          <span @click="() => handleAddEditJob(record)">关联下属岗位</span>
        </div>
      </template>
      <span slot="serial" slot-scope="text, record, index">{{ index + 1 }}</span>
      <template slot="enable" slot-scope="text">
        {{ text === 1 ? '可用' : '不可用' }}
      </template>
    </list-table>
    <addEditPost :visible="visible" :postIndex="postIndex" :postInfo="postInfo" @handleCancel="handleCancel" @getTable="getTable" :postList.sync="postList"></addEditPost>

    <addEditJob :visibleJob="visibleJob" :postInfo="postInfo" @handleCancel="handleCancel" @getTable="getTable"></addEditJob>
  </div>
</template>

<script>
import { columns, baseColumn } from './model'
import { getPostManageList3, deletePostManageListNew } from '@/api/system/system'
import addEditPost from './addEditPost'
import { postsLabel } from '@/api/system/system'

import addEditJob from './addEditJob'
export default {
  name: 'PostManage',
  components: {
    addEditPost,
    addEditJob
  },
  props: {
    orgId: {
      type: String,
      default: ''
    },
    disabled: {
      type: Boolean,
      default: false
    }
  },
  data() {
    return {
      visible: false,
      visibleJob: false,
      postIndex: 1,
      postInfo: {},

      columns: columns,
      chooseData: 0,
      tableData: [],

      selectedRowKeys: [],
      selectedRows: [],
      selectOptions: {}, // 选中节点对象

      postList: [], //岗位标签数组
      loadData: (parameter) => {
        if (!this.orgId) return
        console.log('parameter',parameter)
        let params = {
          resultWithEmployee: true, // 为true时返回岗位人员
          pageNumber: parameter.pageNo,
          pageSize: parameter.pageSize,
          orgId: this.orgId
        }
          return getPostManageList3(params).then((res) => {
            this.total = res.data?.length;
            let arr = []
            if (res.data?.length){
              arr = res.data.splice(((parameter.pageNo - 1) * parameter.pageSize),(parameter.pageNo * parameter.pageSize))
            }
            console.log('arrarrarr',arr)
           return { code: 200, data: arr, totalSize: this.total }
          })
        },
    }
  },
  created() {
    // let params = this.$route.params
    // console.log(params)
    // this.orgId = params.orgId
    this.initPage()
    this.getTable()
  },
  mounted() {},
  methods: {
    /**
     *@desc 获取岗位标签
     *@param {}
     */
    async getPostsLabel() {
      let res = await postsLabel()
      if (res.status === 200 && res?.data?.length > 0) {
        this.postList = res.data
      }
    },
    initPage() {
      const isCompany = this.$route.query.isCompany
      if (!isCompany) {
        this.columns = baseColumn
      }
    },
    /**
     *@desc  获取组织列表
     *@param {}
     */
    getTable() {
      let that = this
      if (that.orgId) {
        // 获取列表
        that.handleTable()
      }
    },
    /**
     *@desc  table表格列表
     *@param {}
     */
    handleTable() {
      this.$refs.table.refresh(true)
    },
    /**
     *@desc  table表格选中
     *@param {}
     */
    onSelectChange(selectedRowKeys, selectedRows) {
      let _this = this
      _this.selectId = []
      selectedRows.map((item) => {
        // 选中id
        _this.selectId.push(item.id)
      })
      this.chooseData = this.chooseData + selectedRows.length
      _this.selectedRowKeys = selectedRowKeys
      _this.selectedRows = selectedRows
    },
    /**
     *@desc  table表格搜索 暂停查询
     *@param {}
     */
    /**
     *@desc  table新增编辑
     *@param {}
     */
    handleAddEditPost(record, index) {
      this.postIndex = index
      this.postInfo = record == '' ? { orgId: this.orgId } : record
      this.visible = true
      this.getPostsLabel()
    },
    /**
     *@desc  添加关联岗位
     *@param {}
     */
    handleAddEditJob(record) {
      console.log(record)
      this.postInfo = record

      this.visibleJob = true
      this.postInfo = record
    },
    /**
     *@desc  table表格删除
     *@param {}
     */
    handleDeleteWarning(record) {
      let _this = this
      _this.$confirm({
        title: `你确定要删除${record.name}吗？`,
        okText: '确认',
        okType: 'danger',
        cancelText: '取消',
        onOk() {
          _this.handleDelete(record)
        },
        onCancel() {
          // console.log('Cancel');
        }
      })
    },
    handleDelete(record) {
      deletePostManageListNew({ id: record.id }).then((res) => {
        if (res.status === 200) {
          //删除成功
          this.getTable()
          this.$message.success('删除成功')
        } else {
          this.$message.error(res?.data?.msg || '删除失败')
        }
      })
    },
    handleCancel() {
      this.visible = false
      this.visibleJob = false
      this.getTable()
    }
  }
}
</script>

<style scoped lang="less">
@deep: ~'>>>';
.postManageModal{
  @{deep} .ant-table{
     tr th:nth-last-child(2), tr td:nth-last-child(2){
        border-right: 2px solid #e8e8e8;
     }
  }

}
</style>
